<style lang="scss" scoped>
@import '../../styles/common/loading.less';
.container{
    border: none !important;
    margin-top: 4px;
}
.el-col-offset-1 {
    margin-left: 0%;
}
.button_a {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);
}
.col_a {
    margin-left: 2%;
}
.el-card {
    height: 200px;
}

.el-button--primary {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);
}
</style>
<template>
    <div    class="common-background-color"
            v-loading="loading"
            element-loading-text="loading......"
            element-loading-spinner="el-icon-loading"
            element-loading-background="rgba(0, 0, 0, 0.8)">
        <div style="width:98%;margin: 6px 12px;">
            <el-collapse v-model="activeNames">
                <el-collapse-item title="注销信息"  name="1">
                    <!-- 注销信息 -->
                    <el-form ref="prpLCancel" :model="prpLCancel"  class="info-submit-form">
                        <el-row type="flex">
                            <el-col :span="8">
                                <el-form-item label="大病赔案号">
                                    <el-input v-model="prpLCancel.caseNo"  disabled></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="保单号">
                                    <el-input v-model="policyNo"  disabled></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8">
                                <el-form-item label="社/医保号">
                                    <el-input v-model="socialSecurityNo"  disabled></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex">
                            <el-col :span="8">
                                <el-form-item label="被保险人">
                                    <el-input v-model="insuredName"  disabled></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8" >
                                <el-form-item label="证件号">
                                    <el-input v-model="documentNo"  disabled></el-input>
                                </el-form-item>
                            </el-col>
                            <el-col :span="8"  >
                                <el-form-item label="注销原因">
                                    <el-input v-model="prpLCancel.cancelReasonName"  disabled></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex">
                            <el-col :span="24" >
                                <el-form-item label="注销详情" :required="true">
                                    <el-input show-word-limit disabled v-model="prpLCancel.cancelDescribe" type="textarea" ></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>
                </el-collapse-item>
            </el-collapse>
            <!-- 审核意见 -->
            <el-collapse  v-model="activeNames"  >
                <el-collapse-item title="审核意见"  name="2">
                    <el-form :model="prpLClaimOpinionDTO"  class="info-submit-form">
                        <el-row type="flex">
                            <el-col :span="8">
                                <el-form-item label="审核意见：" prop="auditOpinion">
                                    <el-radio :disabled="canEdit" v-model="prpLClaimOpinionDTO.auditOpinion" label="03">同意</el-radio>
                                    <el-radio :disabled="canEdit" v-model="prpLClaimOpinionDTO.auditOpinion" label="04">退回</el-radio>
                                </el-form-item>
                            </el-col>
                        </el-row>
                        <el-row type="flex" class="input-textarea">
                            <el-col :span="24">
                                <el-form-item label="审核备注：" prop="remark">
                                    <el-input :disabled="canEdit" show-word-limit v-model="prpLClaimOpinionDTO.remark" type="textarea" ></el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>
                </el-collapse-item>
            </el-collapse>

        </div>
        <div style="margin-top: 25px;text-align: center;height: 70px">
            <el-button type="primary" size="medium" style="width: 9%" v-if="this.taskState==='01'">放弃任务</el-button>
            <el-button type="primary" size="medium" style="width: 9%" v-if="this.taskState==='01'" @click="onSubmit()">提  交</el-button>
            <el-button type="primary" size="medium" style="width: 9%" @click="closePage()">关  闭</el-button>
        </div>
        <el-dialog
          :visible.sync="Successdialog"
          :show-close="false"
          :close-on-click-modal="true"
          :close-on-press-escape="false"
          width="20%"
          center>
          <div style="margin-top: -35px;">
            <div>| 调查审核提交</div>
            <hr style="width: 80%;margin-left: 1px">
          </div>
          <div v-if="this.item===0" style="text-align: center;margin-top: 20px">
            <img src="../../assets/images/pass.png" width="60">
            <div style="margin-top: 10px">提交成功</div>
            <div style="margin-top: 10px">大病赔案号：{{prpLCancel.caseNo}}</div>
          </div>
          <div v-if="this.item===1" style="text-align: center;margin-top: 20px">
            <img src="../../assets/images/notPass.png" width="60">
            <div style="margin-top: 10px">提交失败</div>
            <div style="margin-top: 10px">大病赔案号：{{prpLCancel.caseNo}}</div>
          </div>
          <div style="margin-top: 15px;text-align: center"><span style="font-size: x-large">{{time}}</span>秒后跳转到上一个页面</div>
          <div slot="footer" class="dialog-footer">
            <el-button @click="closePage" type="text">关闭</el-button>
          </div>
        </el-dialog>
    </div>
</template>

<script>
import { queryCaseCancelDetail, auditCaseCancel } from '@/api/baseDate'
import Cookies from "js-cookie";
export default {
    name: 'caseCancelAuditDetailCache',
    data() {
        return {
            activeNames: ['1','2'],
            loading: false,
            Successdialog:false,
            item:0,
            time:0,
            prpLCancel: {
                handleComrCode: '',
                handleComrName: '',
                handlerCode: '',
                handlerName: '',
                cancelReason:'', // 注销原因代码
                cancelReasonName:'', // 注销原因
            },
            prpLClaimOpinionDTO: {
                auditOpinion:'',
                remark:'',
                evaluate:'',
            },
            id:'',
            taskState:'',
            policyNo:'', // 保单号
            insuredName:'', // 被保险人
            socialSecurityNo:'', // 社保号
            documentTypeName:'', // 证件类型
            documentNo:'', // 证件号
            comCode: '', // 归属机构编码
            data:{}, // 提交数据
            canEdit: false
        }
    },
    activated(){
        if(this.$route.params.taskId!=undefined){
            this.queryCaseCancelAuditTaskDetail();
        }
    },
    created() {
        this.queryCaseCancelAuditTaskDetail();
    },
    methods: {
        // 案件详情
        queryCaseCancelAuditTaskDetail(){
            let taskId  = this.$route.params.taskId;
            this.id = taskId;
            this.taskState = this.$route.params.taskState;
            this.canEdit = false;
            if(this.taskState == '03' || this.taskState =='04' || this.taskState == '05'){
                this.canEdit = true;
            }
            const param = {
                id: this.id,
            }
            this.policyNo = this.$route.params.policyNo;
            this.insuredName = this.$route.params.insuredName;
            this.socialSecurityNo = this.$route.params.socialSecurityNo;
            this.documentTypeName = this.$route.params.documentTypeName;
            this.documentNo = this.$route.params.documentNo;
            // this.prpLCancel.cancelReasonName = this.$route.params.cancelReasonName;
            queryCaseCancelDetail(param) .then((res)=> {
                if(res){
                    if(res.data.resultCode){
                        if(res.data.resultCode != '0000'){ 
                            // 返回失败
                            this.$message.error(res.data.resultMsg);
                        }else{
                            this.prpLCancel = res.data;
                            this.prpLClaimOpinionDTO = res.data.prpLClaimOpinionDTO;
                            if (this.prpLCancel.cancelReason ==='a' ) {
                                this.prpLCancel.cancelReasonName = '客户报错案和重复报案'
                            } else if (this.prpLCancel.cancelReason === 'b') {
                                this.prpLCancel.cancelReasonName = '不属于投保险别或险种出险'
                            } else if (this.prpLCancel.cancelReason === 'c') {
                                this.prpLCancel.cancelReasonName = '客户主动放弃索赔'
                            } else if (this.prpLCancel.cancelReason === 'd') {
                                this.prpLCancel.cancelReasonName = '其它'
                            }
                        }
                    }else{
                        this.$message.error('系统异常'); 
                    }
                }else{
                  this.$message.error('系统异常'); 
                }
            })
        },
        onSubmit(){
            this.prpLCancel.handleComrCode = Cookies.get("makeCom");
            this.prpLCancel.handleComrName = Cookies.get("cMakeCom");      
            this.prpLCancel.handlerCode = Cookies.get("userCode");
            this.prpLCancel.handlerName = Cookies.get("userName");
            this.data = this.prpLCancel;
            this.data.prpLClaimOpinionDTO = this.prpLClaimOpinionDTO;
            this.data.prpLClaimOpinionDTO.taskType = "cancel_audit";
            this.data.taskState = this.prpLClaimOpinionDTO.auditOpinion;
            if(this.prpLClaimOpinionDTO.auditOpinion == undefined || this.prpLClaimOpinionDTO.auditOpinion == null || this.prpLClaimOpinionDTO.auditOpinion == ''){
                this.$message.warning('审核意见不能为空！');
                return;
            }
            // 禁止重复点击
            if(this.loading){
                return;
            }
            this.loading = true;
            auditCaseCancel(this.data)
                .then(res => {
                this.loading = false;
                this.Successdialog=true
                // 把time改为5
                this.time = 5;
                // 设定一个定时器，每一秒调用一次coundDown方法，time-1
                setInterval(this.countDown, 1000);
                }).catch((function () {
                    /*let THIS = this;*/
                    this.item = 1;
                    this.Successdialog=true
                    // 把time改为5
                    this.time = 5;
                    // 设定一个定时器，每一秒调用一次coundDown方法，time-1
                    setInterval(this.countDown, 1000);
                }))
        },
        // 关闭当前页
        closePage(){
            this.Successdialog=false
            this.closePageTo(this.$store,this.$route,this.$router,'caseCancelAudit');
        },
        // 封装一个方法
        countDown() {
            this.time--;
        },
    },
    watch: {
        // 监听time的值
        time: function (newVal) {
            if (newVal == 0) {
                this.Successdialog=false
                this.closePageTo(this.$store,this.$route,this.$router,'caseCancelAudit');
            }
        }
    }
}
</script>